<template>
  <div>
    <a-page-header :ghost="false" title="我的考试" />
    <div v-if="spinning == true" class="example">
      <a-spin :spinning="spinning" size="large"> </a-spin>
    </div>
    <a-card
      v-if="spinning != true"
      :bordered="false"
      style="margin-left: 16px;margin-right: 16px;margin-top: 16px;"
    >
      <a-card :bordered="false">
        <a-row :gutter="16">
          <a-col :span="20">
            <a-form-model layout="inline">
              <a-form-model-item label="考试名称">
                <a-input placeholder="请输入考试名称" />
              </a-form-model-item>
              <a-form-model-item>
                <a-button type="primary">
                  搜索
                </a-button>
              </a-form-model-item>
            </a-form-model>
          </a-col>
        </a-row>
      </a-card>
      <a-table :columns="columns" :data-source="data">
        <!-- <a slot="name" slot-scope="text">{{ text }}</a> -->
        <span slot="customTitle"> 考试名称</span>
        <span slot="action" slot-scope="text, record">
          <!-- <span slot="action"> -->
          <a :href="'/home/check/examinationPaper?id=' + record.idx"
            >查看试卷</a
          >
        </span>
      </a-table>
    </a-card>
  </div>
</template>

<script>
import moment from "moment";
const columns = [
  {
    dataIndex: "name",
    key: "name",
    slots: { title: "customTitle" },
    scopedSlots: { customRender: "name" }
  },
  {
    title: "主观",
    dataIndex: "score",
    key: "score"
  },
  {
    title: "客观",
    dataIndex: "objectScore",
    key: "objectScore"
  },
  {
    title: "考试状态",
    dataIndex: "status",
    key: "status"
  },
  {
    title: "提交时间",
    key: "time",
    dataIndex: "time"
  },
  {
    title: "操作",
    key: "action",
    scopedSlots: { customRender: "action" }
  }
];

export default {
  data() {
    return {
      data: [],
      columns,
      spinning: true
    };
  },
  methods: {
    getExamDataList() {
      this.$axios
        .get("/get/examData/list", {
          headers: {
            Authorization: localStorage.getItem("token")
          }
        })
        .then(res => {
          if (res.data.code == 200) {
            console.log("list", res.data.data);
            localStorage.setItem(
              "examData_list",
              JSON.stringify(res.data.data)
            );
            for (var i = 0; i < res.data.data.length; i++) {
              this.data.push({
                idx: i,
                key: res.data.data[i].examId,
                score: res.data.data[i].score,
                objectScore: res.data.data[i].objectScore,
                name: res.data.data[i].examName,
                setting: JSON.parse(res.data.data[i].examSetting),
                time: moment(res.data.data[i].createdTime).format(
                  "YYYY-MM-DD HH:mm:ss"
                )
              });
              if (
                this.data[i].score + this.data[i].objectScore >=
                this.data[i].setting[0].examPassScore
              )
                this.data[i].status = "通过";
              else this.data[i].status = "未通过";
            }
            this.spinning = false;
          } else {
            this.$message.error(res.data.msg);
          }
        });
    }
  },
  created() {
    this.getExamDataList();
  },
  watch: {}
};
</script>

<style scoped>
.example {
  text-align: center;
  /* background: rgba(0, 0, 0, 0.05); */
  border-radius: 4px;
  margin-bottom: 20px;
  padding: 30px 50px;
  margin: 20px 0;
}
</style>
